<%@ page language="java" import="java.util.*"  pageEncoding="utf-8"%>
<%@include file="common/tag.jsp"%>
<c:set var="CTX" value="${pageContext.request.contextPath}" />
<%@include file="common/indexhead.jsp"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <base href="<%=basePath%>">
    
    <title>销售出库单详情页</title>
    </head>
  <style>
  .panel .panel-heading button {
  	padding: ;
	margin-left: ;
	background-color: ;
	border: ;
	outline: ;
  }
  </style>
 <body>
<div class="panel panel-primary">
	<div class="panel-heading">
		<div>
			<h3 class="panel-title">销售出库单详情页</h3>
		</div>
		<div class="button"
			style="float: right;margin-top: -27px;margin-right: 5px;">
			<a class="btn btn-info" href="#" onclick="javascript:window.close();"><i class="fa fa-sign-out"></i>退出</a>
		</div>
		<div class="button"
			style="float: right;margin-top: -27px;margin-right: 5px;">
			<div class="btn btn-info"   onclick="tijiao()" href=""><i class="fa fa-check"></i>保存</div>
		</div>
	</div>
	<div class="panel-body" style="height:87%">

		<!-- <form modelAttribute="User"    id="userdetail" action="/user/update" method="POST" class="form-horizontal" -->
			<form    action="/salesout/adddo" method="post"  id="salesoutadd"  class="form-horizontal"
			style="width:95%;margin-top: 50px;">
			<fieldset>
			<table class="table table-bordered">
				<div class="form-group">
					<label class="col-sm-1 control-label">出库单号</label>
					<div class="col-sm-3">
						<input readOnly=true class="form-control" id="salesOutCkdh" name="salesOutCkdh" type="text"
						placeholder = "${salesOut.salesOutCkdh}" value = "${salesOut.salesOutCkdh}"/>
					</div>
					<label class="col-sm-1 control-label">出库日期</label>
					<div class="col-sm-3">
						<input readOnly=true class="form-control mydate" id="salesOutrq" name="salesOutrq" type="text"
						placeholder = "<fmt:formatDate value="${salesOut.salesOutrq}" pattern="MM/dd/yyyy"/>" value = "<fmt:formatDate value="${salesOut.salesOutrq}" pattern="MM/dd/yyyy"/>"/>
					</div>
					<label class="col-sm-1 control-label">发货人</label>
					<div class="col-sm-3">
						<input readOnly=true style="width:55%;display: inline-block;" class="form-control" id="salesOutFhr" name="salesOutFhr" type="text"
						placeholder = "${salesOrder.salesOutFhr}" value = "${salesOrder.salesOutFhr}"/>
						<input style="display:none" class="form-control" id="salesOutFhrId" name="salesOutFhrId" type="text"
						placeholder = "${salesOrder.salesOutFhrId}" value = "${salesOrder.salesOutFhrId}"/>
						<a class="btn btn-info"  onclick="yongan.dialog.showdialog('/util/usertree','deptdialog','salesOutFhr','salesOutFhrId');"><i class="fa fa-sign-out"></i>选择人员</a>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-1 control-label">销售订单</label>
					<div class="col-sm-3">
						<input readOnly=true style="display: inline-block;" class="form-control" id="salesOrderXsdh" name="salesOrderXsdh" type="text"
						placeholder = "${salesOut.salesOrder.salesOrderXsdh}" value = "${salesOut.salesOrder.salesOrderXsdh}"/>
						<input style="display:none" class="form-control" id="salesOutSpddId" name="salesOutSpddId" type="text"
						placeholder = "${salesOut.salesOutSpddId}" value = "${salesOut.salesOutSpddId}"/>
					</div>
					<label class="col-sm-1 control-label">发货仓库</label>
					<div class="col-sm-3">
						<input readOnly=true class="form-control" id="salesOrderXsck" name="salesOrderXsck" type="text"
						placeholder = "${salesOut.salesOrder.salesOrderXsck}" value = "${salesOut.salesOrder.salesOrderXsck}"/>
					</div>
					<label class="col-sm-1 control-label">出库金额</label>
					<div class="col-sm-3">
						<input style="display: inline-block;" class="form-control" id="salesOutCkje" name="salesOutCkje" type="text"
						placeholder = "${salesOut.salesOutCkje}" value = "${salesOut.salesOutCkje}"/>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-1 control-label">客户</label>
					<div class="col-sm-3">
						<input readOnly=true style="display: inline-block;" class="form-control" id="salesOrderGmkh" name="salesOrderGmkh" type="text"
						placeholder = "${salesOut.salesOrder.salesOrderGmkh}" value = "${salesOut.salesOrder.salesOrderGmkh}"/>
					</div>
					<label class="col-sm-1 control-label">联系人</label>
					<div class="col-sm-3">
						<input readOnly=true class="form-control" id="salesOrderDhr" name="salesOrderDhr" type="text"
						placeholder = "${salesOut.salesOrder.salesOrderDhr}" value = "${salesOut.salesOrder.salesOrderDhr}"/>
					</div>
					<label class="col-sm-1 control-label">联系电话</label>
					<div class="col-sm-3">
						<input readOnly=true class="form-control" id="salesOrderLxdh" name="salesOrderLxdh" type="text"
						placeholder = "${salesOut.salesOrder.salesOrderLxdh}" value = "${salesOut.salesOrder.salesOrderLxdh}"/>
					</div>
				</div>
				</table>
			</fieldset>
			<hr></hr>
<style>
.table >thead> tr> th{
	text-align:center;
	vertical-align: middle;
	background-color: #DDD9D4;
	border-color:#BEC2C1;
	padding-left: 0px;
}
.table >tbody> tr> td>input{
	width:100%;
}
.table >tbody> tr> td {
	text-align:center;
	width:8%
}
</style>
<table class="table table-bordered">
  <caption style="width:90%">出库货品明细
  <p style="float:right;width:50%;text-align:right">
  <a style="display:none"   onclick="addTable();" class="btn btn-info">增加商品</a>
  <a  style="display:none"  onclick="del();" class="btn btn-danger">批量删除</a>
  </p></caption>
  <thead>
    <tr>
	  <!-- <th style="width:3%" rowspan="2"><input type='checkbox'  id='checkAll' onclick="checkAll_f()" value='New'></th> -->
	  <th colspan="3">货品信息</th>
      <th rowspan="2">单位</th>
      <th rowspan="2">数量</th>
      <th rowspan="2">出库数量</th>
      <th rowspan="2">单价</th>
      <th rowspan="2">总金额</th>
      <th rowspan="2">备注</th>
      <th rowspan="2">到货日期</th>
     <!--  <th rowspan="2">操作</th> -->
    </tr>
    <tr>
      <th>货品编码</th>
      <th>货品名称</th>
      <th>规格型号</th>
    </tr>
  </thead>
  <tbody id="addTable">
	    <c:forEach var="details" items="${salesOut.details}"  varStatus="status">
			<tr>
				<!-- <td  style='width:3%'><input type='checkbox' name='count' value='New'></td> -->
				<td style="display:none"><input style="display:none" class='form-control' id='count${status.index+1}' type='text' value="${details.salesOrderDetailsId}" name='details[${status.index}].salesOrderDetailsId' ></td>
				<td><input readOnly=true class='form-control' id='count${status.index+1}' type='text' value="${details.salesOrderDetailsHpbm}" name='details[${status.index}].salesOrderDetailsHpbm' ></td>
				<td>${details.salesOrderDetailsHpmc}</td>
				<td>${details.salesOrderDetailsGgxh}</td>
				<td>${details.salesOrderDetailsHpdw}</td>
				<td><input readOnly=true class='form-control' id='count${status.index+1}' type='text' value="${details.salesOrderDetailsHpsl}" name='details[${status.index}].salesOrderDetailsHpsl' ></td>
				<td><input class='form-control' id='count${status.index+1}' type='text' value="${details.salesOrderDetailsCksl}" name='details[${status.index}].salesOrderDetailsCksl' ></td>
				<td>${details.salesOrderDetailsHpdj}</td>
				<td>${details.salesOrderDetailsHpzje}</td>
				<td>${details.salesOrderDetailsBz}</td>
				<td><fmt:formatDate value="${details.salesOrderDetailsDhrq}" pattern="MM/dd/yyyy"/></td>
			</tr>
		</c:forEach> 
  </tbody>
</table>
		</form>
		<hr></hr>
		

	</div>
</div>
<div id="deptdialog">
</div>
<!-- 弹出框重写 -->
<div id="ycf-alert" class="modal">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
            <h5 class="modal-title"><i class="fa fa-exclamation-circle"></i> [Title]</h5>
          </div>
          <div class="modal-body small">
            <p>[Message]</p>
          </div>
          <div class="modal-footer" >
            <button type="button" class="btn btn-primary ok" data-dismiss="modal">[BtnOk]</button>
            <button type="button" class="btn btn-default cancel" data-dismiss="modal">[BtnCancel]</button>
          </div>
        </div>
      </div>
    </div>
<!-- 弹出框重写end -->
<%@include file="common/indexbottom.jsp"%>
<script type="text/javascript">
var row_count = $("#addTable tr").length; 

$(function() {

$( ".mydate" ).datepicker();
window.Modal = function() {
    var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm');
    var alr = $("#ycf-alert");
    var ahtml = alr.html();
    
    var _alert = function(options) {
        alr.html(ahtml); // 复原
        alr.find('.ok').removeClass('btn-success').addClass('btn-primary');
        alr.find('.cancel').hide();
        _dialog(options);

        return {
            on: function(callback) {
                if (callback && callback instanceof Function) {
                    alr.find('.ok').click(function() {
                        callback(true)
                    });
                }
            }
        };
    };

    var _confirm = function(options) {
        alr.html(ahtml); // 复原
        alr.find('.ok').removeClass('btn-primary').addClass('btn-success');
        alr.find('.cancel').show();
        _dialog(options);

        return {
            on: function(callback) {
                if (callback && callback instanceof Function) {
                    alr.find('.ok').click(function() {
                        callback(true)
                    });

                }
            }
        };
    };

    var _dialog = function(options) {
        var ops = {
            msg: "提示内容",
            title: "操作提示",
            btnok: "确定",
            btncl: "取消"
        };

        $.extend(ops, options);

        console.log(alr);

        var html = alr.html().replace(reg,
        function(node, key) {
            return {
                Title: ops.title,
                Message: ops.msg,
                BtnOk: ops.btnok,
                BtnCancel: ops.btncl
            } [key];
        });

        alr.html(html);
        alr.modal({
            width: 500,
            backdrop: 'static'
        });
    }

    return {
        alert: _alert,
        confirm: _confirm
    }

} ();
});

function tijiao() {
Modal.confirm({
    msg: "是否保存该条数据？"
}).on(function(e) {
    var json = "{";
	for(var q=0;q<$("#addTable tr").length;q++){
		json=json+"'details["+q+"].salesOrderDetailsId':'"+$("input[name='details["+q+"].salesOrderDetailsId']").val()+"',";
		json=json+"'details["+q+"].salesOrderDetailsHpbm':'"+$("input[name='details["+q+"].salesOrderDetailsHpbm']").val()+"',";
		json=json+"'details["+q+"].salesOrderDetailsHpsl':'"+$("input[name='details["+q+"].salesOrderDetailsHpsl']").val()+"',";
		json=json+"'details["+q+"].salesOrderDetailsCksl':'"+$("input[name='details["+q+"].salesOrderDetailsCksl']").val()+"',";
		json=json+"'details["+q+"].salesOrderDetailsDhrq':'"+$("input[name='details["+q+"].salesOrderDetailsDhrq']").val()+"',";
	}
	json=json+"'salesOutId':'${salesOut.salesOutId}',";
	json=json+"'salesOutrq':'"+$("#salesOutrq").val()+"',";
	json=json+"'salesOutFhr':'"+$("#salesOutFhr").val()+"',";
	json=json+"'salesOutFhrId':'"+$("#salesOutFhrId").val()+"',";
	json=json+"'salesOutFhck':'"+$("#salesOutFhck").val()+"',";
	json=json+"'salesOutFhckId':'"+$("#salesOutFhckId").val()+"',";
	json=json+"'salesOutCkje':'"+$("#salesOutCkje").val()+"',";
	json=json+"'salesOutSpddId':'"+$("#salesOutSpddId").val()+"'";
	json=json+"}";
	console.log(json);
	var b=eval('(' + json+ ')');
    $.ajax({
        type: "post",
        url: yongan.URL.salesOutUpdate(),
        dataType: "json",
        data: b,
        success: function(data) {

            if (data['success']) {
                Modal.alert({
                    msg: data['data']['stateinfo'],
                    title: '执行结果',
                    btnok: '确定',
                    btncl: '取消'
                }).on(function(e) {
                    window.close();
                });
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert(XMLHttpRequest);
            alert(textStatus);
            alert(errorThrown);
        }
    });
});
}
</script>
  </body>
</html>